<style>
.arandomPwdDiv { margin: 0 auto; min-width: 460px; max-width: 460px; padding: 20px 0px; }
.arandomPwdUl { list-style: none; width: 100%; display: table; padding: 0px;}
.arandomPwdUl > li { padding: 13px 8px; float: left; background-color: #dad6d6; border: 1px solid #eebfbf; }
.arandomPwdUl > li:nth-child(odd) { height: 48px; width: 90px; line-height: 21px; font-size: 13px; font-weight: bold; }
.arandomPwdUl > li:nth-child(even) { background-color: white; width: 370px; }
#arandomPwdStr { border: 1px solid #eebfbf; padding: 0px 10px; font-size: 15px; font-weight: 300; border-radius: 5px; color: black; }
.textbox .textbox-text { font-size: 14px; }
</style>

<div class="arandomPwdDiv">
    <ul class="arandomPwdUl">
        <li>所用字符</li>
        <li>
            <input class="easyui-checkbox" data-options="label:'a-z',labelPosition:'after',labelWidth:46,checked:true,disabled:true">
            <input class="easyui-checkbox" data-options="label:'A-Z',labelPosition:'after',labelWidth:46,checked:true,disabled:true">
            <input class="easyui-checkbox" data-options="label:'0-9',labelPosition:'after',labelWidth:46,checked:true,disabled:true">
            <input class="easyui-checkbox" data-options="label:'!@#$%^&*+=-?',labelPosition:'after',labelWidth:110,checked:true,disabled:true">
        </li>
        <li>密码长度</li>
        <li style="padding: 8px 8px">
            <input id="arandomPwdLenth" class="easyui-textbox" data-options="height:30,width:350" value="12">
        </li>
    </ul>
    <div style="text-align: center; margin: 12px 0px;">
        <a href="javascript:arandomPwdMethod()" class="easyui-linkbutton" data-options="iconCls:'icon-add'">生成密码</a>
    </div>
    <div id="arandomPwdStr">
        <!-- 随机密码 -->
    </div>
</div>

<script type="text/javascript">
function arandomPwdMethod() {
    $('#arandomPwdStr').empty();

    let length = $('#arandomPwdLenth').textbox('getValue');
    if (length < 6 || length > 40) {
        $.messager.alert('提示', '密码长度6-40', 'error');
        return;
    }

    for (let i = 0; i < 6; i++) {
        $('#arandomPwdStr').append('<p>' + arandomPwdUtil(length) + '</p>');
    }
}

function arandomPwdUtil(length) {
    let rep = ['!', '@', '#', '$', '%', '^', '&', '*', '+', '=', '-', '?'];
    let pwd = "";
    for (let i = 0; i < length; i++) {
        let index = Math.floor(Math.random() * 4);
        if (index == 0) {
            // 取值 [97-122]，并转化成 小写字母
            pwd += String.fromCharCode(Math.floor(Math.random() * (122 - 97 + 1)) + 97);
        } else if (index == 1) {
            // 取值 [65-90]，并转化成 大写字母
            pwd += String.fromCharCode(Math.floor(Math.random() * (90 - 65 + 1)) + 65);
        } else if (index == 2) {
            // 取值 [0-9]
            pwd += Math.floor(Math.random() * 10);
        } else if (index == 3) {
            // 取值 [!@#$%^&*+=-?]
            pwd += rep[Math.floor(Math.random() * rep.length)];
        }
    }
    return pwd;
}
</script>